import { IFeidaoAiBrowserComponent } from '@feidao/web/interfaces';
import p02 from './p06';
import render from '@feidao/web/atom/browser/render/render';
import get_form_data from '@feidao/web/atom/browser/form/get-data';

export default async function a014(fd: IFeidaoAiBrowserComponent, ...args: any[]) {
	fd.data.node.querySelector<HTMLAreaElement>('[data-feidao-id="fd-w000006-003"]').innerHTML = '';
	// 获取属性，渲染p02
	const widgets = fd.data.node.querySelector<HTMLFormElement>('[name="widgets"]');
	const data = get_form_data(widgets);
	let attrs = '';
	for (const attr in data) {
		if (data.hasOwnProperty(attr)) {
			const v = data[attr];
			if (v === true) {
				attrs += attr + ' ';
			} else {
				if (v) {
					attrs += attr + '=\'' + v + '\' ';
				}
			}
		}
	}
	render(fd, attrs, p02, 'p02', 'inner');

	const a = fd.data.node.querySelector<HTMLAreaElement>('[data-feidao-id="fd-w000006-002"]');
	a.innerHTML = `
	<fd-w000006 data-feidao-id="fd-w000006-001" style="width:50em;height:30em;display:block;position: absolute;" ${attrs}>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="1" is-before="true"
	  slot="day">
	  今天
	</div>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="2" is-before="true"
	  slot="day">
	  昨天
	</div>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="2" is-before="false"
	  slot="day">
	  明天
	</div>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="7" is-before="true"
	  slot="day">
	  过去的7天
	</div>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="7" is-before="false"
	  slot="day">
	  未来的7天
	</div>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="30" is-before="true"
	  slot="day">
	  过去的30天
	</div>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="30" is-before="false"
	  slot="day">
	  未来的30天
	</div>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="1" is-before="true"
	  slot="month">
	  本月
	</div>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="2" is-before="true"
	  slot="month">
	  上个月
	</div>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="2" is-before="false"
	  slot="month">
	  下个月
	</div>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="5" is-before="true"
	  slot="month">
	  过去的5个月
	</div>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="5" is-before="false"
	  slot="month">
	  未来的5个月
	</div>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="1" is-before="true"
	  slot="year">
	  本年
	</div>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="2" is-before="true"
	  slot="year">
	  上一年
	</div>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="2" is-before="false"
	  slot="year">
	  明年
	</div>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="3" is-before="true"
	  slot="year">
	  上3年
	</div>
	<div style="width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em" interval="3" is-before="false"
	  slot="year">
	  未来的3年
	</div>
	<button slot="btn-sure" style="width:80px;
			  height:28px;
			  background:#444;
			  border:1px solid #444;
			  border-radius:4px;
			  color:#fff;
			  margin-left: 2px;">确定</button>
	<button slot="btn-cancle" style="width:80px;height:30px;
			  border:1px solid rgb(197, 110, 110);
			  border-radius:4px;
			  background:#fff;
			  margin-left:13px;
			  margin-top: 10px;
			  margin-bottom: 5px;">取消</button>
	<div slot="some">
	  <div>开始</div>
	  <input type="date" name="select-start" />
	  <div>结束</div>
	  <input type="date" name="select-end" />
	</div>
  </fd-w000006>
	`;

}
